<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/Sound.css">
<link rel="stylesheet" href="css/jquery.fileupload-ui.css">
<link rel="stylesheet"
	href="http://blueimp.github.com/jQuery-Image-Gallery/css/jquery.image-gallery.min.css">
<link rel="stylesheet"
	href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="js/uploader/jquery.ui.widget.js"></script>
<script src="js/uploader/jquery.iframe-transport.js"></script>
<script src="js/uploader/jquery.fileupload.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>

<script>
	$(function() {
		$("#tabs").tabs( {
			selected: 1,
			fx: { width: 'toggle', duration: '500' },
			beforeActivate: function(event, ui) {
				if (ui.newPanel.selector == '#tab2')
				{
					$('#pluginsList').show();
					var $dialog = $('#pluginsList').dialog(
							{title:   'New Tab',
				             modal: true,   //dims screen to bring dialog to the front
				             show: {
				            	 effect: "fade",
				            	 duration: 300
				             },
				             hide: {
				            	 effect: "fade",
				            	 duration: 300
				             },
					         buttons: {
					            'OK': function() {
									var tabs = $( "#tabs" ).tabs();
									var ul = tabs.find( "#theNewTab" );
									$( "<li><a href=" + $('#hahahahahaha :selected').val() + ">" + $('#hahahahahaha :selected').text() + "</a></li>" ).insertBefore('#theNewTab');
									tabs.tabs( "refresh" );
									$(this).dialog("close");
					            },
					            'Cancel': function() {
					                $(this).dialog("close");
					            }
					         }});
					return false;
				}
			},
		});
		$("#jimsUlBtn").button().click(function() {
			$("#harhar").click();
		})
	});
</script>

<title>Jim's Random Stuff</title>

</head>
<body>
	<div id='tabs'>
		<ul>
			<li><a href='#tab1'>File Manager</a></li>
			<li id='theNewTab'><a href='#tab2'>New Tab</a></li>
		</ul>
		<div id='tab1'>
			<table id="filetable"></table>
			<form id="fileupload" data-url="UploadServlet" method="POST" enctype="multipart/form-data">
				<input id="harhar" type="file" name="files[]" multiple>
			</form>
			<button id="jimsUlBtn">Add File</button>
		</div>
		<div id='tab2'>
		</div>
	</div>

	<div id="pluginsList" style="display: none">
		<select id="hahahahahaha">
		</select>
	</div>

	<script>
		$(function() {
			$.getJSON('PluginManager?getPluginList', function(data) {
				$.each(data, function(key, val) {
					$('<option value=' + key + '> ' + val + '</option>').appendTo("#hahahahahaha");
				});
		});});
	</script>

	<script src="js/selectFile.js"></script>
</body>


</html>
